<!DOCTYPE html>
<html lang="en">
<?php
session_start();
if (!isset($_SESSION['userid'])) {
  echo "<script>alert('请先登录！');window.location.href='login.php';</script>";
}
?>

<head>
  <meta charset="UTF-8">
  <title>发布帖子</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="https://unpkg.com/easymde/dist/easymde.min.css">
  <script
    src="https://cloud.tinymce.com/5/tinymce.min.js?apiKey=rwlq7c7se0bxoxpe5fzs1tbzmeg52i00g0pcyxc2pa37m9q2"></script>
  <script src="tinymce.min.js"></script>
  <script src="tinymce/js/tinymce/langs/zh_CN.js" type="text/javascript" charset="utf-8"></script>
  <script>
    tinymce.init({
      selector: 'textarea',
      plugins: [
        // Core editing features
        'anchor', 'autolink', 'charmap', 'codesample', 'emoticons', 'image', 'link', 'lists', 'media', 'searchreplace', 'table', 'visualblocks', 'wordcount',
        // Your account includes a free trial of TinyMCE premium features
        // Try the most popular premium features until Jun 11, 2025:
        'checklist', 'mediaembed', 'casechange', 'formatpainter', 'pageembed', 'a11ychecker', 'tinymcespellchecker', 'permanentpen', 'powerpaste', 'advtable', 'advcode', 'editimage', 'advtemplate', 'ai', 'mentions', 'tinycomments', 'tableofcontents', 'footnotes', 'mergetags', 'autocorrect', 'typography', 'inlinecss', 'markdown', 'importword', 'exportword', 'exportpdf'
      ],
      toolbar: 'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough | link image media table mergetags | addcomment showcomments | spellcheckdialog a11ycheck typography | align lineheight | checklist numlist bullist indent outdent | emoticons charmap | removeformat',
      tinycomments_mode: 'embedded',
      tinycomments_author: 'Author name',
      language: 'zh_CN',
      mergetags_list: [
        { value: 'First.Name', title: 'First Name' },
        { value: 'Email', title: 'Email' },
      ],
      ai_request: (request, respondWith) => respondWith.string(() => Promise.reject('See docs to implement AI Assistant')),
    });
  </script>
  <style>
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    .header {

      position: sticky;
      height: 70px;
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 10px;
      top: 0px;
      background-color: #fff;
      box-shadow: #ccc 0px 5px 20px 0px;

      &>.logo {
        list-style: none;
        width: 200px;

        & .logo {
          width: 200px;
        }
      }

      &>.options {
        display: flex;
        list-style: none;

        & li {
          margin-right: 20px;
          padding: 10px;
          border-radius: 5px;
          font-size: 20px;
          color: #0327b3;
          cursor: pointer;

          &:hover {
            color: #fff;
            background-color: #2A4DD0;
          }

          &>a {
            color: inherit;
            text-decoration: none;
          }
        }
      }

      &>.login {
        width: 200px;
      }
    }

    .li-user {
      max-height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      /* 新增，作为绝对定位参照 */

      &>.image-box {
        display: flex;
        justify-content: center;
        align-items: center;

        &>.user-image {
          max-width: 70px;
          max-height: 30px;
        }
      }

      &>.username {
        margin: 0 5px;
        max-width: 100px;
        overflow-x: hidden;
        text-overflow: ellipsis;
      }
    }

    /* 退出登录按钮样式开始 */
    .logout {
      width: 100%;
      position: absolute;
      top: 0px;
    }

    .logout button {
      width: 100%;
      height: 50px;
      background: red;
      border: none;
      border-radius: 5px;
      cursor: pointer;
      transition: all 0.5s ease;
      display: none;
      margin-top: 0;
      /* 修改为0，去掉负margin */
      float: none;
      /* 去掉float */
    }

    .logout button a {
      text-decoration: none;
      color: #fff;
      font-size: 16px;
    }

    .li-user:hover .logout button {
      width: 100%;
      display: inline-block;
      /* 改为inline-block更合适 */
    }

    /* 退出登录按钮样式结束 */
  </style>
  <style>
    body {
      margin: 0;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      background-color: #f4f6f9;
    }

    .navbar {
      background-color: #fff;
      padding: 16px 30px;
      box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
    }

    .navbar h1 {
      margin: 0;
      font-size: 20px;
      color: #333;
    }

    .main {
      display: flex;
      padding: 30px;
      gap: 30px;
      max-width: 1200px;
      margin: auto;
    }

    .left-panel {
      flex: 3;
      background: #fff;
      padding: 25px;
      border-radius: 8px;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
    }

    .right-panel {
      flex: 1;
      background: #fff;
      padding: 20px;
      border-radius: 8px;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
      position: sticky;
      top: 80px;
      height: fit-content;
    }

    input[type="text"],
    select {
      width: 100%;
      padding: 12px;
      margin-top: 10px;
      margin-bottom: 20px;
      border: 1px solid #ccc;
      border-radius: 6px;
      font-size: 16px;
    }

    .btn {
      width: 100%;
      padding: 12px;
      background-color: #2A4DD0;
      color: #FFF4A3;
      font-weight: bold;
      border: none;
      border-radius: 6px;
      font-size: 16px;
      cursor: pointer;
    }

    .btn:hover {
      background-color: #041F9A;
      color: #FFF4A3;
    }
  </style>
</head>

<body>

  <div class="header">
    <ul class="logo">
      <li>
        <img src="../image/logo.png" alt="" class="logo">
      </li>
    </ul>
    <ul class="options">
      <li><a href="./">论坛首页</a></li>
      <li><a href="./list.php">板块</a></li>
      <li><a href="./">我的帖子</a></li>
      <li class="li-user">
        <div class='image-box'>
          <img src="<?php
          if (isset($_SESSION['head'])) {
            echo '../image/head/' . $_SESSION['head'];
          } else {
            echo '../image/head/Default1.jpg';
          }
          ?>" alt="user" class='user-image' onerror='this.onerror=null; this.src="../image/head/Default.jpg";'>
        </div>
        <?php
        if (isset($_SESSION['username'])) {
          echo "<a>" . $_SESSION['username'] . "</a>";
          echo <<<EOF
                    <div class="logout">
                    <button><a href="../control/doLogin.php?action=logout"
                            onclick="confirm('确认退出登录吗？')">退出登录</a></button>
                </div>
EOF;
        } else {
          echo "<a href='login.php'>登录</a>";
        }
        ?>

      </li>
    </ul>

  </div>
  <?php
  // require_once '../model/topicDao.php';
  

  ?>
  <form action="../control/doEditTopic.php" method="post" enctype="multipart/form-data">
    <div class="main">
      <!-- 左边：内容编辑区 -->
      <div class="left-panel">

        <label>标题</label>
        <input type="text" name="title" required>

        <label>正文内容</label>
        <textarea name="content" id="editor" cols="50" rows="26"></textarea>

      </div>

      <!-- 右边：分类设置 -->
      <div class="right-panel">
        <h3>分类选择</h3>
        <label>请选择版块</label>
        <select name="boardid">
          <?php
          require_once '../model/boardDao.php';
          echo "<h1>我草泥马</h1>";
          $ids = get_all_boards();
          var_dump($ids);
          foreach ($ids as $id) {
            echo "<option value='$id[boardid]'>$id[boardName]</option>";
          }
          ?>
        </select>

        <input type="submit" value="发布文章" class="btn">
      </div>
    </div>
  </form>




</body>

</html>